<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
<title>添加店面产品</title>
<meta name="decorator" content="default" />
<style type="text/css">
.ui-field-contain fieldset div.ui-input-text {
	float: left;
	width: 60%;
}

#selectbutton{
	margin-left: 10%;
}
</style>
<script type="text/javascript">
	$().ready(function() {
		$("#selectProductEvent ul li").delegate("a", "click", function() {
			var item = $(this);
			document.getElementById("product-id").value = item.attr("id");
			document.getElementById("product-name").value = item.attr("name");
			document.getElementById("product-spec").value = item.attr("spec");
			document.getElementById("product-retail_price").value = item.attr("price");
			$("#selectProduct").popup("close");
		});
		$("#inventoryInForm").validate({
			submitHandler: function(form){
				if(!$("#product-id").val()) {
					showTip("请选择要入库的产品");
				} else {
					form.submit();
				}
			},
			errorContainer: "#messageBox",
			errorPlacement: function(error, element) {
				$("#messageBox").text("输入有误，请先更正。");
				if (element.is(":checkbox")||element.is(":radio")){
					error.appendTo(element.parent().parent());
				} else {
					error.insertAfter(element);
				}
			}
		});
	});
</script>

</head>
<body>
	<div class="container">
		<c:if test="${!inProduct.editing}">
			<div style="text-align: center;">
				<h3>添加产品</h3>
			</div>
			<form:form id="inventoryInForm"
				action="${ctx}/inventory/in/storeselfProduct/add" class="form-input"
				modelAttribute="inProduct">
				<form:hidden path="product.id" id="product-id" />
				<div data-role="fieldcontain">
					<label>产品名称</label>
					<fieldset data-role="controlgroup" data-type="horizontal"
						data-inline="true">
						<form:input type="text" id="product-name" readonly="true"
							path="product.storeSelfProduct.name" />
						<c:if test="${!inProduct.editing}">
							<a id="selectbutton" href="#selectProduct" data-rel="popup" data-inline="true"
								data-icon="plus" data-position-to="window" data-transition="pop"
								data-role="button">选择产品</a>
						</c:if>
					</fieldset>
				</div>
				<div data-role="fieldcontain">
					<label>产品规格</label>
					<form:input path="product.storeSelfProduct.spec" type="text" id="product-spec"
						readonly="true" />
				</div>
				<div data-role="fieldcontain">
					<label>零售价</label>
					<form:input path="product.storeSelfProduct.retail_price" type="text"
						id="product-retail_price" readonly="true" />
				</div>
				<div data-role="fieldcontain">
					<label>进货数量</label>
					<form:input path="amount" type="number" min="1" class="required" />
				</div>
				<div class="icon-buttons">
					<a href="${ctx}/inventory/in/product/page" data-role="button"
						data-inline="true" data-icon="back" data-iconpos="notext">返回</a> <input
						data-inline="true" data-icon="check" data-iconpos="notext"
						type="submit" value="保存" />
				</div>
			</form:form>
			<div data-role="popup" id="selectProduct">
				<div data-role="header">
					<h1>选择店面自营产品</h1>
				</div>
				<div data-role="content" style="overflow:scroll;height:12em;"
					id="selectProductEvent">
					<ul data-role="listview" id="productsList" data-filter="true">
						<c:forEach items="${inventoryIn.storeProductList}" var="data">
							<li><a name="${data.storeSelfProduct.name}"
								spec="${data.storeSelfProduct.spec}" id="${data.id}"
								price="${data.storeSelfProduct.retail_price}" href="#">${data.storeSelfProduct.name}</a></li>
						</c:forEach>
					</ul>
				</div>
			</div>
		</c:if>
		<c:if test="${inProduct.editing}">
			<div style="text-align: center;">
				<h3>编辑产品</h3>
			</div>
			<form:form id="inventoryInForm"
				action="${ctx}/inventory/in/storeselfProduct/edit"
				class="form-input" modelAttribute="inProduct">
				<form:hidden path="product.id" id="product-id" />
				<div data-role="fieldcontain">
					<label>产品名称</label>
					<form:input type="text" id="product-name" readonly="true"
						path="product.storeSelfProduct.name" />
				</div>
				<div data-role="fieldcontain">
					<label>产品规格</label>
					<form:input path="product.storeSelfProduct.spec" type="text" id="product-spec"
						readonly="true" />
				</div>
				<div data-role="fieldcontain">
					<label>零售价(元)</label>
					<form:input path="product.storeSelfProduct.retail_price" type="text"
						id="product-retail_price" readonly="true" />
				</div>
				<div data-role="fieldcontain">
					<label>进货数量</label>
					<form:input path="amount" type="number" min="1" class="required" />
				</div>
				<div class="icon-buttons">
					<a href="${ctx}/inventory/in/product/page" data-role="button"
						data-inline="true" data-icon="back" data-iconpos="notext">返回</a> <input
						data-inline="true" data-icon="check" data-iconpos="notext"
						type="submit" value="保存" />
				</div>
			</form:form>

		</c:if>
	</div>
</body>
</html>
